
<script setup>
import Versions from './components/Versions.vue'
import { getAppVersion } from './utils/ipc'
import { ref, onMounted } from 'vue'

const appVersion = ref('')
const notification = ref('')

const ipcHandle = async () => {
  try {
    notification.value = 'Fetching version...'
    const version = await getAppVersion()
    notification.value = `App version: ${version} (via IPC)`
    appVersion.value = version
  } catch (error) {
    console.error('IPC Error:', error)
    notification.value = error.message.includes('IPC API not available') 
      ? 'IPC API not loaded - check preload script'
      : 'Failed to get version'
  }
}

onMounted(async () => {

})
</script>

<template>
  <img alt="logo" class="logo" src="./assets/electron.svg" />
  <div class="creator">Powered by electron-vite</div>
  <div class="text">
    Build an Electron app with
    <span class="vue">Vue</span>
  </div>
  <p class="tip">Please try pressing <code>F12</code> to open the devTool</p>
  <div class="actions">
    <div class="action">
      <a href="https://electron-vite.org/" target="_blank" rel="noreferrer">Documentation</a>
    </div>
    <div class="action">
      <a target="_blank" rel="noreferrer" @click="ipcHandle">Get Version via IPC</a>
    </div>
  </div>
  <Versions />
  <div class="version-info">
    App version: {{ appVersion }}
  </div>
  <div class="notification" v-if="notification">
    {{ notification }}
  </div>
</template>